<template>
	<div>
	  <el-table 
	   :header-cell-style="{background:'#F3F4F7',color:'#555',}"
	   :data="Data3" 
	   style="width: 1300px;margin: 2px auto;">
		<el-table-column prop="goodsInfo" label="商品信息" width="540" />
		<el-table-column prop="price" label="单价" width="180" />
		<el-table-column prop="num" label="数量" width="180" />
		<el-table-column prop="sum" label="实付款" width="180" />
		<el-table-column prop="status" label="交易状态" width="120"/>
	  </el-table>
	</div>
</template>

<script setup>
import { ref ,onMounted } from 'vue'
import { useRoute } from 'vue-router'
const route = useRoute() // 获取路由对象
let Data3 = ref(null); // 使用 ref 来定义 
onMounted(() => {
  const ds = route.query.item;
  try {
    
    let parsedData = JSON.parse(ds);
    Data3.value = parsedData.filter(item => item.status === "未付款");
	
  } catch (e) {
    console.error('解析查询参数失败:', e);
    Data3 = null;
  }
})

const Data= ref([
	{
		goodsInfo: 'xxx',
	    price: '5.00',
		num:'3',
		sum:'15',
		status: '未收货'
	}
])
</script>

<style>
</style>